<template>
	<view style="padding: 0rpx 5rpx 0rpx 5rpx;">
		<swiper :indicator-dots="false" class="swiper1" style="background-color:white" :current="current"
			@change='changeSwiper'>
			<swiper-item v-for="(item,index) in list" :key="index">
				<up-form labelPosition="left" :labelStyle="labelStyle" :borderBottom="true" :ref="'orderForm'+index"
					:model="item" :rules="gaiJiaRules">
					<up-form-item label="跟单员" label-width="140" prop="genduanyuan" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.gendanyuan" readonly />
					</up-form-item>
					<up-form-item label="SKU名称" label-width="140" prop="skuName" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.skuName" readonly />
					</up-form-item>
					<up-form-item label="外包装" label-width="140" prop="packageMethod" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.packageMethod" readonly />
					</up-form-item>
					<up-form-item label="内包装" label-width="140" prop="innerPackageMethod" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.innerPackageMethod" readonly />
					</up-form-item>
					<up-form-item label="产品名称" label-width="140" prop="productName" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.productName" readonly />
					</up-form-item>
					<up-form-item label="品种" label-width="140" prop="productName" :borderBottom="true">
						<up-input border="none" readonly>
							<template #prefix>
								<template v-for="(item1, index) in item.varietySplits" :key="index">
									{{ item1+"、" }}
								</template>
							</template>
						</up-input>
					</up-form-item>
					<up-form-item label="等级" label-width="140" prop="variety" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.grade" readonly />
					</up-form-item>
					<up-form-item label="最小规格/kg" label-width="140" prop="minimum" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.minimum" readonly />
					</up-form-item>
					<up-form-item label="箱规(数量)" label-width="140" prop="weight" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.weight" readonly />
					</up-form-item>
					<up-form-item label="订货数量(箱/件)" label-width="140" prop="piece" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.piece" readonly />
					</up-form-item>
					<up-form-item label="销售单价(最小规格/元)" label-width="140" prop="price" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.price" readonly />
					</up-form-item>
					<up-form-item label="销售合计/元" label-width="140" prop="priceTotal" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.priceTotal" readonly />
					</up-form-item>

					<up-form-item label="订单重量" label-width="140" prop="weightTotal" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.weightTotal" readonly />
					</up-form-item>
					<up-form-item label="销售单价/公斤/元" label-width="140" prop="desc" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.desc" readonly />
					</up-form-item>
					<up-form-item label="出库类型" label-width="140" prop="type" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.type" readonly />
					</up-form-item>
					<up-form-item label="新旧货" label-width="140" prop="extent" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.extent" readonly />
					</up-form-item>
					<up-form-item label="打托方式(箱/托)" label-width="140" prop="palletizingMethod" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.palletizingMethod" readonly />
					</up-form-item>
					<up-form-item label="备注" label-width="140" prop="notes" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.notes" readonly />
					</up-form-item>
					<up-form-item label="指定园区" label-width="140" prop="companyName" :borderBottom="true">
						<up-input type="text" class="form-field-select" v-model="item.companyName" readonly />
					</up-form-item>
					<up-form-item label="调价后单价" label-width="140" prop="adjustPrice" :borderBottom="true" required>
						<up-input type="number" class="form-field-select" v-model="item.adjustPrice" placeholder="调价后单价"
							@update:modelValue="adjustPrice(item)" />
					</up-form-item>
					<up-form-item label="调价后销售合计/元" label-width="140" prop="adjustPriceTotal" :borderBottom="true"
						required>
						<up-input type="number" class="form-field-select" v-model="item.adjustPriceTotal"
							placeholder="自动计算" />
					</up-form-item>
					<up-form-item label="调价后单价(公斤/元)" label-width="140" prop="adjustDesc" :borderBottom="true" required>
						<up-input type="number" class="form-field-select" v-model="item.adjustDesc"
							placeholder="自动计算" />
					</up-form-item>
					<up-loadmore loadmoreText="可左右滑动" color="red" lineColor="red" line />
				</up-form>
			</swiper-item>
		</swiper>
		<view style="margin-top: 0rpx;padding: 0rpx 30% 0rpx 30%;">
			<up-button type="primary" color="green" shape="circle" text="改价保存" @click="gaiJiaSave"></up-button>
		</view>
	</view>
</template>

<script>
	import orderApi from '@/apis/gyl/order.js';
	export default {
		props: {
			belongList: {
				type: Array,
				default: {}
			}
		},
		data() {
			return {
				labelStyle: {
					color: '#aaa',
					fontSize: '30rpx'
				},
				list: [],
				current: 0,
				gaiJiaRules: {
					adjustPrice: [{
						required: true,
						trigger: ['blur', 'change'],
						message: "请输入调价后单价"
					}, ],
					adjustPriceTotal: [{
						required: true,
						trigger: ['blur', 'change'],
						message: "请输入调价后单价"
					}, ],
					adjustDesc: [{
						required: true,
						trigger: ['blur', 'change'],
						message: "请输入调价后单价"
					}, ],
				},

			}
		},
		methods: {
			adjustPrice(item) {
				if (item) {
					item.adjustPriceTotal = (item.weight * item.piece * item.adjustPrice).toFixed(2);
					item.adjustDesc = (item.adjustPrice / item.minimum).toFixed(2);
				} else {
					item.adjustPriceTotal = "0.00";
					item.adjustDesc = "0.00";
				}
			},

			/**
			 * app 调用
			 */
			dateClick() {
				this.dateShow = true;
			},

			changeSwiper(e) {
				this.current = e.detail.current;
			},

			/**
			 * 改价保存
			 */
			async gaiJiaSave() {
				var flag = true;
				var index = 0;
				for (var i = 0; i < this.list.length; i++) {
					const ref = eval("this.$refs.orderForm" + i)[0];
					await ref.validate().then(res => {}).catch(errors => {
						flag = false;
						index = i;
						uni.$u.toast(errors[0].message)
					})
					if (!flag) {
						break;
					}
				}
				if (!flag) {
					this.current = index;
					return;
				}
				this.list.forEach(item=>{
					item.indId = item.id
				})
				const res = await orderApi.adjustPrice({
					detailList: this.list,
				});
				if (res.success) {
					uni.showToast({
						icon: 'none',
						duration: 1000,
						title: '销售订单改价成功',
						complete: function() {
							var timer = setInterval(() => {
								uni.navigateBack();
								clearInterval(timer);
							}, 1000)
						}
					});

				} else {
					uni.showToast({
						icon: 'none',
						duration: 1000,
						title: '销售订单改价失败'
					});
				}
			}
		},
		mounted() {
			this.list = this.belongList;
		}
	}
</script>

<style scoped>
	.swiper1 {
		height: 1700rpx;
	}

	.u-form {
		border: 2px solid #dfdfdf;
		/* 	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); */
		border-radius: 15px;
	}
</style>